
<template>
    <div class="risk">
        <div class="danger-menu">
            <div class="danger-menu-list">
                <eagle-image-upload style="margin-bottom:10px" :image="require('@/assets/Images/AppIcon/icon_danger_main_snapshot.png')" @after-read="afterRead">
                </eagle-image-upload>
                <div>随手拍</div>
            </div>
            <div class="danger-menu-list" @click="handleCheck()">
                <img src="@/assets/Images/AppIcon/icon_danger_main_template.png" alt="" />
                <div>检查表</div>
            </div>
            <div class="danger-menu-list" @click="goClassifys()">
                <img src="@/assets/Images/AppIcon/icon_danger_main_lawgist.png" alt="" />
                <div>检查依据</div>
            </div>
        </div>
        <!-- 隐患排查治理 -->
        <div class="content">
            <van-divider><span class="danger-title">隐患排查治理</span></van-divider>
            <div class="list">
                <div class="list-title">
                    我的检查<span>您提交隐患后由管理员统一分配责任人处理</span>
                </div>
                <div class="content-menu">
                    <div class="content-menu-list" @click="goMyTask()">
                        <van-badge :content="list.DangerPlanTask" max="99">
                            <img src="@/assets/Images/AppIcon/icon_danger_main_checktask.png" alt="" />
                        </van-badge>
                        <div>我的检查任务</div>
                    </div>
                    <div class="content-menu-list" @click="goMyTaskHistory()">
                        <van-badge :content="list.DangerRecord" max="99">
                            <img src="@/assets/Images/AppIcon/icon_danger_main_checkdetail.png" alt="" />
                        </van-badge>
                        <div>我的检查历史</div>
                    </div>
                </div>
            </div>
            <div class="list">
                <div class="list-title">
                    我的整改<span>在隐患未彻底整改前，应采取临时措施确保安全</span>
                </div>
                <div class="content-menu">
                    <div class="content-menu-list" @click="goMyMeasures()">
                        <van-badge :content="list.DangerFormulate" max="99">
                            <img src="@/assets/Images/AppIcon/icon_danger_main_formulate.png" alt="" />
                        </van-badge>
                        <div>待我制定的措施</div>
                    </div>
                    <div class="content-menu-list" @click="goMyHiddenDanger()">
                        <van-badge :content="list.DangerCorrective" max="99">
                            <img src="@/assets/Images/AppIcon/icon_danger_main_corrective.png" alt="" />
                        </van-badge>
                        <div>待我整改的隐患</div>
                    </div>
                    <!-- <div class="content-menu-list">
            <img
              src="@/assets/Images/AppIcon/icon_danger_overdue_unfinish.png"
              alt=""
            />
            <div>超期未完成隐患</div>
          </div> -->
                </div>
            </div>
        </div>
        <!-- 监管隐患整改 -->
        <div class="content">
            <van-divider><span class="danger-title">监管隐患整改</span></van-divider>
            <div class="list">
                <div class="list-title">
                    我的监管隐患整改<span>处理监管单位提交的隐患</span>
                </div>
                <div class="content-menu">
                    <div class="content-menu-list" @click="goSuperMeasures()">
                        <van-badge :content="list.JGDangerFormulate" max="99">
                            <img src="@/assets/Images/AppIcon/icon_danger_main_formulate.png" alt="" />
                        </van-badge>
                        <div>待我制定措施</div>
                    </div>
                    <div class="content-menu-list" @click="goSuperHiddenDanger()">
                        <img src="@/assets/Images/AppIcon/icon_danger_main_corrective.png" alt="" />

                        <div>待我整改的隐患</div>
                    </div>
                </div>
            </div>
        </div>
        <div class="content" v-if="roles.indexOf('admin') != -1">
            <van-divider><span class="danger-title">计划 审批 验收 报告</span></van-divider>
            <div class="list">
                <div class="list-title">分配任务<span>安排检查任务</span></div>
                <div class="content-menu">
                    <div class="content-menu-list" @click="_goCheckTask">
                        <img src="@/assets/Images/AppIcon/icon_danger_main_checkplan.png" alt="" />
                        <div>创建检查计划</div>
                        <span>批量创建定期循环检查计划</span>
                    </div>
                    <div class="content-menu-list" @click="_goCheckPlan">
                        <img src="@/assets/Images/AppIcon/icon_danger_main_checkdetail.png" alt="" />
                        <div>检查计划清单</div>
                        <span>我制定的检查计划清单</span>
                    </div>
                </div>
            </div>
            <div class="list">
                <div class="list-title">隐患管理<span>管理本部门相关的隐患</span></div>
                <div class="content-menu">
                    <div class="content-menu-list" @click="goHiddenDangerConfirm()">
                        <van-badge :content="list.DangerHiddenDanger" max="99">
                            <img src="@/assets/Images/AppIcon/icon_danger_main_hiddendanger.png" alt="" />
                        </van-badge>
                        <div>隐患确认</div>
                        <span>确认并指派整改部门/人</span>
                    </div>
                    <div class="content-menu-list" @click="goDistributionTask()">
                        <van-badge :content="list.DangerAssign" max="99">
                            <img src="@/assets/Images/AppIcon/icon_danger_main_assign.png" alt="" />
                        </van-badge>
                        <div>分配整改任务</div>
                        <span>分配隐患整改负责人</span>
                    </div>
                    <!-- <div class="content-menu-list">
            <img
              src="@/assets/Images/AppIcon/icon_danger_main_approve.png"
              alt=""
            />
            <div>延期整改审批</div>
            <span>整改超过30天需审批</span>
          </div> -->
                </div>
            </div>
            <div class="list">
                <div class="list-title">
                    隐患验收<span>验收本部门员工或本人提交的隐患整改情况</span>
                </div>
                <div class="content-menu">
                    <div class="content-menu-list" @click="goHiddenDangerCheck()">
                        <van-badge :content="list.DangerVerify" max="99">
                            <img src="@/assets/Images/AppIcon/icon_danger_main_verify.png" alt="" />
                        </van-badge>
                        <div>验收隐患</div>
                        <span>验收本部门提交的隐患</span>
                    </div>
                    <div class="content-menu-list" @click="goCheckreportk()">
                        <img src="@/assets/Images/AppIcon/icon_danger_main_report.png" alt="" />
                        <div>检查报告</div>
                        <span>生成隐患报告和整改对比报告</span>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
import { getDangerToDoCnt } from "@/api/commonMessage";
import { upload } from "@/api/common";
import { mapGetters } from "vuex";
export default {
    data() {
        return {
            fileList: [],
            list: {},
        };
    },
    computed: {
        ...mapGetters(["roles"]),
    },
    created() {
        this.getList();
    },
    methods: {
        // 上传图片
        afterRead(file) {
            this.$router.push({
                name: "DangerCheckTaskDetailEdit",
                query: {
                    originType: 3,
                    file: file,
                },
                params: {
                    file: file,
                },
            });
        },
        onOversize(file) {
            Toast("文件大小不能超过 2M");
        },
        getList() {
            getDangerToDoCnt().then((res) => {
                let newObj = {};
                res.data.map((item, index) => {
                    let newkey = item.TemplateCode;
                    let newValue = item.Cnt;
                    newObj[newkey] = item.Cnt;
                });
                this.list = newObj;
            });
        },

        goMyTask() {
            this.$router.push({
                path: "/Danger/DangerCheckTaskTaskList",
                query: {},
            });
        },

        goMyTaskHistory() {
            this.$router.push({
                path: "/Danger/DangerCheckTaskDetailList",
                query: {},
            });
        },

        goSuperMeasures() {
            this.$router.push({
                path: "/Danger/JGFormulatedList",
                query: {},
            });
        },

        goHiddenDangerConfirm() {
            this.$router.push({
                path: "/Danger/DangerCheckTaskConfirmList",
                query: {},
            });
        },
        goDistributionTask() {
            this.$router.push({
                path: "/Danger/DangerCheckDetailBeAssignedList",
                query: {},
            });
        },
        goSuperHiddenDanger() {
            this.$router.push({
                path: "/Danger/JGFCorrectivedList",
                query: {},
            });
        },

        goHiddenDangerCheck() {
            this.$router.push({
                path: "/Danger/DangerCheckTaskDetailVerifyList",
                query: {},
            });
        },
        // 检查报告
        goCheckreportk() {
            this.$router.push({
                path: "/Danger/CheckReport",
                query: {},
            });
        },
        handleCheck() {
            this.$router.push({
                path: "/Danger/DangerTemplateList",
                query: {},
            });
        },
        goClassifys() {
            this.$router.push({
                path: "/Danger/Classifys",
                query: {
                    hasPhoto: "hasPhoto",
                },
            });
        },
        // 创建检查计划
        _goCheckTask() {
            this.$router.push({
                path: "/Danger/CheckPlanEdit",
                query: {
                    id: 0,
                },
            });
        },
        // 检查计划清单
        _goCheckPlan() {
            this.$router.push({
                path: "/Danger/checkplan",
                query: {},
            });
        },
        goMyMeasures() {
            this.$router.push({
                path: "/Danger/MyMeasuresList",
                query: {},
            });
        },

        goMyHiddenDanger() {
            this.$router.push({
                path: "/Danger/MyCorrectiveList",
                query: {},
            });
        },
    },
};
</script>

<style lang="less" scoped>
.risk {
    background-color: #e8f1f8;
}
.danger-menu {
    display: flex;
    width: 100%;
    height: 100px;
    background-color: #383d40;
    .danger-menu-list {
        flex: 1;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        font-size: 13px;
        color: #fff;
        img {
            width: 55px;
            height: 55px;
            margin-bottom: 10px;
        }
    }
}
.content {
    background-color: #fff;
    padding: 10px;
    padding-top: 0;
    padding-bottom: 0;

    overflow: hidden;
    margin-bottom: 10px;
    .danger-title {
        color: orange;
        font-weight: bold;
    }
    .list {
        background-color: #f8f8f8;
        padding: 10px 5px;
        font-size: 14px;
        border-radius: 5px;
        margin-bottom: 10px;
        .list-title {
            color: #000;
            span {
                font-size: 10px;
                margin-left: 15px;
                color: #666;
            }
        }
        .content-menu {
            display: flex;
            width: 100%;
            margin: 20px 0 10px 0;
            .content-menu-list {
                flex: 1;
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                font-size: 13px;

                img {
                    width: 25px;
                    height: 25px;
                    margin-bottom: 15px;
                }
                span {
                    margin-top: 10px;
                    font-size: 10px !important;
                    color: #666;
                }
            }
        }
    }
}

/deep/ .upload-img {
    width: 55px !important;
    height: 55px !important;
}
</style>